<!DOCTYPE html>
<html lang="en">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <title>佳丽列表</title>
  <script src="js/vue.js"></script>
</head>

<body>
<div id="app"></div>
</body>
<script>Vue.createApp({
  data() {
    return {
      //---此处修改
      inputValue: '',
      list: []
    }
  },
  methods: {
    handleAddItem() {
      //----此处修改
      this.list.push(this.inputValue)
    }
  },
  template: `
            <div>
                <!--此处修改-->
    <input v-model="inputValue" />
    <button v-on:click="handleAddItem">增加佳丽</button>
    <ul>
    <li v-for="(item,index) of list">[{{index}}]{{item}}</li>
    </ul>
    </div>

    `
    }).mount("#app")
</script>

</html>
